<template>
	<view>
		<view class="fund-header">
			<view class="layout">				
				<view class="fund-header-backend" @click="handleBackendButton()">
					<image src="/static/icon/icon-back.png"></image>
				</view>
				<view class="fund-header-tooltip">
					我的团队
				</view>
				<view class="fund-header-more">
					<image src="/static/icon/icon-moer.png"></image>
				</view>
			</view>
		</view>
		<view class="agent-board">
			<view class="agent-board-box">
				<view class="layout">
					<view class="agent-board-box-volume">
						<view>我的分销商</view>
						<view>234234</view>
					</view>
					<view class="agent-board-box-button">邀请分销商</view>
				</view>
				<view class="agent-board-box-analysis">
					<view class="layout">
						<view class="agent-board-box-analysis-item">
							<view>会员</view>
							<view>23423</view>
						</view>
						<view class="agent-board-box-analysis-item">
							<view>高级VIP</view>
							<view>23423</view>
						</view>
						<view class="agent-board-box-analysis-item">
							<view>超级VIP</view>
							<view>23423</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="agent-box">
			<view class="agent-box-tooltip">邀请列表</view>
			<view class="agent-box-item" v-for="(agent,index) in agentList" :key="index">
				<view class="agent-box-item-text">
					<view class="layout">						
						<view class="agent-box-item-text-icon">
							<image src="../../../static/logo.png"></image>
						</view>
						<view class="agent-box-item-text-note">
							<view>{{agent.fullname}}</view>
							<view>手机号：{{agent.telephone}}</view>
							<view>{{agent.joinTime}}</view>
						</view>
					</view>
				</view>
				<view class="agent-box-item-order">
					<view class="layout">						
						<view>贡献收益：</view>
						<view>￥{{agent.agentProfit}}</view>
					</view>
					<view v-if="3 > 2" class="agent-box-item-order-text">
						<view>支付订单：156单</view>
						<view>退款单数：15单</view>
						<view>交易金额：￥243242.25</view>
						<view>订单均价：￥155</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				agentTotal:0,
				filterForm:{
					page:1,
					size:10
				},
				agentList:[
					{
						fullname:"哪时此刻",
						telephone:"13883095702",
						joinTime:"2024-12-25 12:25:35",
						agentProfit:1200
					},
					{
						fullname:"那山那水",
						telephone:"023-86823256",
						joinTime:"2024-12-25 12:25:35",
						agentProfit:500
					}
				]
			}
		},
		onLoad(options) {
			
		},
		onShow() {
			this.refreshAgentList()
		},
		methods: {
			handleBackendButton:function(){
				let jumpUrl = "/pages/distribution/main/main"
				uni.redirectTo({
					url:jumpUrl
				})
			},
			refreshAgentList:function(){
				let _this = this;
				
				_this.$distribution.getAgentList(_this.filterForm).then(res=>{
					console.log(res)
					if(res.code == 200){
						_this.agentList = res.data.list;
						_this.agentTotal = res.data.total;
					}
				})
			}
			
		}
	}
</script>

<style>
page { padding-top: 100rpx; padding-bottom: 120rpx; background: #ededed; font-size: 14px; }
.fund-header { position: fixed; top: 0; left: 0; right: 0; z-index: 100; }
.fund-header { background: #fff; padding: 15rpx; }

.fund-header-backend { width: 50rpx; height: 40rpx; }
.fund-header-tooltip { width: 600rpx; text-align: center; }
.fund-header-more { width: 50rpx; height: 40rpx; }
.agent-board { height: 300rpx; padding: 15rpx 25rpx; }
.agent-board-box { background: red; color: #fff; border-radius: 25rpx; padding: 25rpx; }

.agent-board-box-volume { width: 200rpx; padding-right: 200rpx; }

.agent-board-box-button { background: #fff; color: red; padding: 10rpx 25rpx; border-radius: 30rpx;}
.agent-board-box-button { margin-left: 50rpx; }

.agent-board-box-analysis { background: #ededed; color: #333; border-radius: 20rpx; margin-top: 25rpx; }
.agent-board-box-analysis-item { width: 200rpx; text-align: center; padding: 15rpx 0; }

.agent-box { padding: 15rpx 25rpx; }
.agent-box-tooltip { padding: 15rpx; font-size: 18px; font-weight: bold; }
.agent-box-item { min-height: 300rpx; margin-top: 25rpx; }
.agent-box-item-text { padding-bottom: 30rpx; }
.agent-box-item-text-icon { width: 100rpx; height: 100rpx; padding-right: 25rpx; }
.agent-box-item-text-icon image { border-radius: 100rpx; }

.agent-box-item-order { background: #ededed; border-radius: 25rpx; padding: 20rpx; }
.agent-box-item-order-text { border-top: #666 1px solid; padding-top: 30rpx; margin-top: 25rpx; }
</style>
